<%--
  Created by IntelliJ IDEA.
  User: ASUS
  Date: 2024/7/19
  Time: 16:02
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>帖子内容</title>
    <script src="js/jquery-3.7.1.min.js"></script>
    <style type="text/css">
        * {
            margin: 0;
            padding: 0;
        }

        #header {
            width: 1000px;
            height: 60px;
            margin: 0 auto;

            border-bottom: 1px solid grey;
        }

        #userhf {
            width: 1000px;
            height: 150px;
            margin: 0 auto;
            border-bottom: 1px solid #4b4a4a;

        }

        #hfk {
            width: 1000px;
            height: 150px;
            margin: 0 auto;
        }

        #lefthf, #hfl {
            width: 299px;
            float: left;
        }

        #righthf, #hfr {
            width: 700px;
            float: left;
        }

        #righthf {
            border-left: 1px solid rgb(128, 128, 128);
        }

        #right {
            height: 500px;
        }

        #righthf {
            height: 150px;
        }

        h2, p {
            margin-left: 20px;
        }

        dl {
            margin-left: 20px;
        }

        h2 {
            text-align: center;
        }

        #btn1 {
            margin-top: 80px;
            margin-left: 10px;
        }
    </style>
</head>

<body>
<%--<button onclick="showReply(this)">cesjo</button>--%>

<div id="header">
    <%--        <div id="left">--%>
    <%--            <dl>--%>
    <%--                <dt></dt>--%>
    <%--                <dd></dd>--%>
    <%--                <dd></dd>--%>
    <%--            </dl>--%>

    <%--        </div>--%>
    <h2>${invitation.subject}</h2>
    <a href="index.jsp">返回</a>
    <a>发布时间:${invitation.creatAt}</a>
    <c:if test="${sessionScope.user != null}">
        <button id="deleteit" onclick="deleteIt()">删除帖子</button>
    </c:if>

</div>

<%--<script type="text/javascript">--%>
<%--    function showReply(obj, contentName) {--%>


<%--        var divObj = document.createElement("div");--%>
<%--        divObj.setAttribute("id", "hfr");--%>
<%--        obj.parentNode.appendChild(divObj);--%>


<%--        document.getElementById("hfr").innerHTML = '<input type="text" id="context" value="" ><button onclick="update()" id="btn2">回复</button> ';--%>


<%--    }--%>


<%--</script>--%>


<c:forEach items="${contents}" var="con" varStatus="i">

    <div id="userhf">
        <div id="lefthf">
            <dl>

                <dt>uid:${con.updaterID}</dt>
                <dd>用户名:<span>${con.updaterName}</span></dd>
                <dd>楼层：${i.count}</dd>

            </dl>

        </div>

        <div id="righthf">

            <p>${con.contentText}</p>
            <c:if test="${i.count!=1}">
                <c:if test="${sessionScope.user != null}">
                    <button onclick="jump('${con.updaterName}',${i.count})" id="btn1">回复</button>
                    <button onclick="deleteContent('${con.id}')" id="deletebtn">删除</button>
                </c:if>

            </c:if>


        </div>
    </div>

</c:forEach>
<c:choose>
    <c:when test="${sessionScope.user != null}">
        <div id="hfk">
            <div id="hfl">
                <p>回复</p>
            </div>
            <div id="hfr">
                <input type="text" id="context" value="">
                <button onclick="update()" id="btn2">回复</button>
            </div>
        </div>
    </c:when>
    <c:otherwise>
        <p>回复请先<a href="index.jsp">登录</a>！</p>
    </c:otherwise>
</c:choose>
<script type="text/javascript">
    function jump(updaterName, count) {
        // 使用JavaScript设置location.hash来跳转到指定的锚点
        document.getElementById("context").value = "回复 @" + updaterName + " " + count + "楼:"
    }

    function update() {
        var text = document.getElementById("context").value;

        $.ajax({
            url: 'invitationServlet',
            type: "post",
            data: {
                op: "reply",
                Invitation_id: '${invitation.id}',
                contentInput: text,
                id: '${user.id}',
                topMark: '${invitation.topMark}',
                primeMark: '${invitation.primeMark}',
                lockMark: '${invitation.lockMark}',
                reversalMark: '${invitation. reversalMark}'

            },
            dataType: "JSON",
            success: function (data) {

                location.reload();
            }
        });

    }

    function deleteContent(contentId) {
        console.log(contentId);
        $.ajax({
            url: 'invitationServlet',
            type: "post",
            data: {
                op: "delete",
                subjectID: '${invitation.id}',
                contentID: contentId
            },
            dataType: "JSON",
            success: function (data) {
                <%--location.href='contentServlet?invId=${invitation.id}';--%>
                location.reload();
            }
        });
    }

    function deleteIt() {
        $.ajax({
            url: 'invitationServlet',
            type: "post",
            data: {
                op: "delete",
                subjectID: '${invitation.id}',
            },
            dataType: "JSON",
            success: function (data) {
                alert("删除成功!")
                location.href = "index.jsp";

            }
        });
    }
</script>
</body>
</html>
